import axios, { AxiosRequestConfig } from 'axios';

// 创建一个axios实例
const $api = axios.create({
  baseURL: 'http://localhost:3030',
    // baseURL: 'http://api.qf2208henduoqian.vip',
});

// 添加请求拦截器
// 在请求发送之前做一些事情
// $api.interceptors.request.use((config) => {
//   // config 请求的所有的参数
//   // 添加token
//   // if (localStorage.getItem('token')) {
//   //   config.headers.Authorization = `Bearer ${localStorage.getItem('token')}`;
//   // }

//   // 除了携带token以外 我们还经常会携带一些公共的参数
//   // 或者 对于参数进行加密或者是序列化

//   return config;
// });

// 添加响应拦截器 统一处理响应的内容
$api.interceptors.response.use(
  (response) => {
    // 对结果进行干预
    const { status, data } = response;

    return response;
  },
  (error) => {
    console.log('if error', error);
    // 响应拦截最主要的功能就是去做异常的统一处理
    const { status } = error.response;
    console.log('status in interceptors', status);
    // message.warning(`接口请求有误 状态码${status}`);
    if (status === 401) {
      // token失效
      // 跳转到登录页
      window.location.href = '/#/login';
    }
  },
);

export default $api;

//  第一步创建axios实例 方便配置一个公共的前置路径(域名)
//  可以配置 请求拦截  和 响应拦截
// 请求拦截当中可以进行一些token携带的操作， 同样也可以携带一些公共的参数的操作还有请求参数的加密和序列化的处理
// 响应拦截可以对于一些公共的错误进行统一处理 比如token过期就可以跳转到登录页 要求用户重新登录
// 把请求的流程封装成函数  然后在业务页面当中进行引入和调用
